<template>
    <view :id="id" ref="mes_content" bubble="true">
        <slot></slot>
    </view>
</template>

<script lang="ts">
import {
    defineComponent,
    ref,
    watch,
    watchEffect,
    computed,
    reactive,
    toRefs,
    onMounted,
    nextTick,
    onUnmounted,
} from "vue";
import { wait } from "@/utils/utils"

const CellContent = defineComponent({
    components: {},

    props: {
        stopGetHeight: {
            type: Boolean,
            default: () => {
                return false;
            },
        },
        	item: {
        		type: Object,
        		default: () => {
        			return {};
        		}
        	},
        	isDeleted: {
        		type: Boolean,
        		default: () => {
        			return false;
        		}
        	}
    },
    setup(props: any, ctx: any) {
        const mes_content = ref(null);
        const oldHeight = ref(0);
        const id = ref('');
        let times = 0;

        const isDeleted = computed(()=>{
            return props.isDeleted;
        })

        const getCurrentHeight = async (ctx) => {

            let refPos = null;
            await wait(200);
            uni.createSelectorQuery()
                    .select('#'+id.value)
                    .boundingClientRect()
                    .exec((ret) => {
                        if (ret && ret.length && ret[0]&& ret[0].height) {
                            let pos = ret[0];
                            oldHeight.value = pos.height;
                            ctx.emit("addHeight", pos.height);
                        } 
                    });

        };

        const recalcHeight = async () => {
            if (props.stopGetHeight) {
                return;
            }

            nextTick(async () => {
                /*#ifdef APP-PLUS*/
                await wait(200);

                uni.createSelectorQuery()
                    .select('#'+id.value)
                    .boundingClientRect()
                    .exec((ret) => {
                        if (ret && ret.length && ret[0]) {
                            let pos = ret[0];
                            ctx.emit("addHeight", pos.height - oldHeight.value);
                        }
                    });

                // await new Promise((callback) => {


                //     // const dom = weex.requireModule("dom");
                //     // dom.getComponentRect(mes_content.value, (e) => {
                //     //     ctx.emit("addHeight", e.size.height - oldHeight.value);
                //     // });
                // });
                /*#endif*/
            });
        };

        onMounted(() => {
            nextTick(() => {
                if (!props.stopGetHeight) {
                    id.value = 'cellConet'+props.item.ID;
                     getCurrentHeight(ctx);
                }

            });

            uni.$once("recalcHeight", recalcHeight);
        });
        onUnmounted(() => {
            uni.$off("recalcHeight", recalcHeight);
        });
        watch(isDeleted,(val)=>{

        })

        watchEffect(() => {
        });
        return {
            mes_content,
            id,
        };
    },
});
export default CellContent;
</script>
<style lang="scss">
</style>


<style lang="scss" scoped>
</style>
